<template>
	<view class="container">
		<navigationBar :titleName="'招标详情'" :url="'pagesIndex/detailshare?id='+id" :detailTitle="info.noticeTitle2"></navigationBar>
		<view class="content">
			<view class="detail">
				<view class="title" v-html="info.noticeTitle"></view>
				<view class="info">
					<view class="source-date">
						<text class="source">{{ info.noticeType }}</text>
						<text class="date">{{ info.publishTime }}</text>
					</view>
					<view class="read" v-if="info.viewCount">
						<uni-icons type="eye"></uni-icons>
						{{ info.viewCount }}
					</view>
				</view>

				<view v-if="bidingTable&&flag" class="setVerticalLayout table">
					<view v-if="bidingTable.totalInvestment" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							总投资
						</text>
						<text class="itemRight">
							{{bidingTable.totalInvestment}}
						</text>
					</view>
					<view v-if="bidingTable.jiaFang&&flag" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							建设方
						</text>

						<text v-if='bidingTable.jiaFangId' class="itemRight setcolor setWeight"
							@click="toentEterprise(bidingTable.jiaFangId)">
							{{bidingTable.jiaFang}}
						</text>
						<text v-if='!bidingTable.jiaFangId' class="itemRight ">
							{{bidingTable.jiaFang}}
						</text>
					</view>

					<view v-if="bidingTable.contacts" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							联系人
						</text>
						<text class="itemRight">
							{{bidingTable.contacts}}
						</text>
					</view>
					<view v-if="bidingTable.contactsPhone" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							联系电话
						</text>
						<text class="itemRight">
							{{bidingTable.contactsPhone}}
						</text>
					</view>
					<view v-if="bidingTable.openTime" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							开标时间
						</text>
						<text class="itemRight">
							{{bidingTable.openTime}}
						</text>
					</view>
					<view v-if="bidingTable.proxyOrgan&&flag" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							招标代理机构
						</text>

						<text v-if='bidingTable.proxyOrganId' class="itemRight setcolor setWeight"
							@click="toentEterprise(bidingTable.proxyOrganId)">
							{{bidingTable.proxyOrgan}}
						</text>
						<text v-if='!bidingTable.proxyOrganId' class="itemRight ">
							{{bidingTable.proxyOrgan}}
						</text>
					</view>
					<view v-if="bidingTable.winningBidder&&flag" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							中标人
						</text>

						<text v-if='bidingTable.winningBidderId' class="itemRight setcolor setWeight"
							@click="toentEterprise(bidingTable.winningBidderId)">
							{{bidingTable.winningBidder}}
						</text>
						<text v-else class="itemRight ">
							{{bidingTable.winningBidder}}
						</text>
					</view>
					<view v-if="bidingTable.bidderMoney" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							中标价
						</text>
						<text class="itemRight">
							{{bidingTable.bidderMoney}}
						</text>
					</view>
					<view v-if="bidingTable.bidder&&flag" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							招标人
						</text>

						<text v-if='bidingTable.bidderId' class="itemRight setcolor setWeight"
							@click="toentEterprise(bidingTable.bidderId)">
							{{bidingTable.bidder}}
						</text>
						<text v-else class="itemRight ">
							{{bidingTable.bidder}}
						</text>
					</view>
					<view v-if="bidingTable.regulatory" class="setOnlyDisplay tableItem">
						<text class="itemLeft">
							监管部门
						</text>
						<text class="itemRight">
							{{bidingTable.regulatory}}
						</text>
					</view>
				</view>
				<view v-if="bidingTable&&flag" class="setDisplayCenter"
					style="background-color: #f4f9ff;margin: 40rpx 0 0 0;padding: 20rpx 5rpx;">
					<u-icon name="info-circle" color="#9d9d00" size="28"></u-icon>
					<text style="color:#9d9d00;">提示：</text>
					<text>以上数据通过人工智能提取，请以正文为准！</text>
				</view>
				<view class="desc">
					<parser :html="info.content"></parser>
				</view>
				<view class="declaration" v-if="info.bidFilePath">
					<view class="button" @click="openPdf(info.bidFilePath)">打开附件</view>
				</view>
				<view class="declaration" v-if="info.urlPath">
					<view class="button" @click="sendEmail">免费发送到邮箱</view>
				</view>
				<view>
					<mp-html v-if="info.noticeContent" :content="info.noticeContent" />
				</view>
			</view>
		</view>
		<pageLoading v-if="showPageLoading"></pageLoading>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import together from '@/common/together.js';
	// import parser from '@/components/parser/parser.vue';
	import pageLoading from '@/components/loading/pageLoading.vue';
	import iconfont from '@/components/iconfont/iconfont.vue';
	import loading from '@/components/loading/loading.vue';
	import util from '@/common/util.js';
	import wechatMP from '@/common/sdk/wechatMP.js';
	import validator from '@/common/validator';
	// import parser from '../../';
	export default {
		components: {
			// parser,
			pageLoading,
			loading,
			iconfont
		},
		data() {
			return {
				isDigg: null,
				isFav: null,
				flag: null,
				id: 0,
				info: {},
				showAddComment: false,
				showCommenBar: true,
				addCommentFocus: false,
				commentContent: '',
				replyCommentId: 0,
				replyNickname: '',
				page_index: 1,
				page_size: 10,
				hasMoreData: false,
				showPageLoading: true,
				currentUrl: '',
				shareUrl: '',
				showShareTip: false,
				showH5Share: false,
				showBrowserShareTip: false,
				//评论数据
				comments: {},
				// 标红关键字
				keyword: null,
				//存储招标信息
				bidingTable: null
				// bidingTable: {
				// 	bidderId:'',
				// 	proxyOrganId:'',
				// 	winningBidderId:'',
				// 	jiaFangId:''
				// }
			};
		},
		onShow(e) {
			this.$initPageTitle(); //初始化页面标题
			if (this.page_index > 1) {
				this.page_index = 1;
				this.getData();
			}

			/*来源是登录时更新*/
			let source = uni.getStorageSync('source');
			if (source == 'login') {
				uni.removeStorageSync('source');
				this.loadData();
			}


		},
		onLoad(e) {
			// 拿取关键字
			if (e.keyword) {
				this.keyword = e.keyword

			}
			if (e.id) {
				this.id = e.id;

				if (!uni.getStorageSync('isLogin')) {
					uni.setStorageSync('LoginPage', '/pagesIndex/detail?id=' + this.id);
				}


				this.getfindZbProperty()
			} else {
				uni.showToast({
					title: '内容不存在'
				})

				return
			}
			// #ifdef H5
			this.currentUrl = encodeURIComponent(window.location.href);
			// #endif
			this.getData();

			this.viewCount();

		},
		onPullDownRefresh() {
			
			this.page_index = 1;
			this.getData();
		},
		onReachBottom(e) {
			if (this.hasMoreData) {
				// this.getComment();
			}
		},

		beforeDestroy() {
			// 更新首页点赞收藏

			uni.$emit('listUpdata')
			uni.$emit('listUpdata2')
		},
		methods: {

			// 跳转至企业详情
			toentEterprise(id) {

				uni.navigateTo({
					url: `/pagesFind/detailenterprise/detailenterprise?companyCid=${id}`
				})
			},

			getfindCompanyName(item, num) {
				// 查询该单位是否存在
				this.$app.request({
					url: this.$baseApp.api.check.zbfindOnlyCompanyName,
					data: {
						name: item
					},
					method: 'GET',
					dataType: 'json',
					success: res => {
						console.log("公司名称是否存在",res)
						if (res.code == 200) {
							if (res.data.content.length > 0) {
								// 跳转至详情
								let id = res.data.content[0].companyCid

								if (num == 1) {
									this.bidingTable.jiaFangId = id
								}
								if (num == 2) {
									this.bidingTable.bidderId = id
								}
								if (num == 3) {
									this.bidingTable.winningBidderId = id
								}
								if (num == 4) {
									this.bidingTable.proxyOrganId = id

								}

							}
						}
						this.flag = true
						// console.log("this.bidingTable",this.bidingTable)
					}
				});
			},
			// 查找该中标信息详情
			getfindZbProperty() {
				let url = this.$baseApp.api.zhaobiao.zbfindZbProperty + "?id=" + this.id;

				// let url = this.$baseApp.api.check.findZbProperty + "?id=" + '1_33_0020010053d7a1a41-6d45-4ad6-b28b-decd4b11ab2e_001';
				this.$http.get(url).then(res => {
					console.log("内容的详情",res)
					if (res.code == '200') {

						if (res.data) {

							this.bidingTable = res.data



							// 获取四个单位的id
							if (this.bidingTable.jiaFang) {
								this.getfindCompanyName(this.bidingTable.jiaFang, 1)

							}
							if (this.bidingTable.bidder) {
								this.getfindCompanyName(this.bidingTable.bidder, 2)

							}
							if (this.bidingTable.winningBidder) {
								this.getfindCompanyName(this.bidingTable.winningBidder, 3)

							}
							if (this.bidingTable.proxyOrgan) {
								this.getfindCompanyName(this.bidingTable.proxyOrgan, 4)

							}

						}
					}

				})
			},

			//发送到邮箱
			sendEmail() {
				if (!uni.getStorageSync('isLogin')) {
					uni.setStorageSync('LoginPage', '/pagesIndex/detail?id=' + this.id);
				}
				uni.showLoading({
					title: '请稍候...'
				})
				let url = this.$baseApp.api.zhaobiao.sendEmail + "/" + this.id;
				let data = {}
				// 查询用户是否已填写好邮箱地址
				this.$http.post(url, data).then(res => {
					if (res.code == '200') {
						this.$alert('成功发送到: ' + res.data);
						uni.hideLoading()
					}
				}, err => {

					console.info(err);
					if (err.code == '509') {
						this.$alert('请先填写邮箱');
						setTimeout(() => {
							// 判断用户是否已绑定手机号，未绑定手机号，跳转至手机号绑定页面
							let wxcathePhone = together.isBindPhone()
							// console.log("wxcathePhone", wxcathePhone)
							// 进入绑定页面  通过传参判断  1 绑定手机  2绑定邮箱
							if (!wxcathePhone) {
								uni.navigateTo({
									url: '/pagesUser/bindMailbox?status=1'
								})
							} else {
								uni.navigateTo({
									url: '/pagesUser/bindMailbox?status=2'
								})
							}
							// uni.navigateTo({
							// 	url:'/pagesUser/profile'
							// })
						}, 1000)
					}
				})
			},
			/*加载数据*/
			loadData() {
				this.getData();
			},

			/*获取文章详情*/
			getData() {
				
				let data = {
					id: this.id
				}

				this.$app.request({
					
					url: this.$baseApp.api.zhaobiao.zbfindDetail,
					data: data,
					method: 'GET',
					dataType: 'json',
					success: res => {
						if (res.code == 200) {
							console.log("文章详细内容",res)
							this.info=res.data
							this.info.noticeTitle2=this.info.noticeTitle
							if (this.keyword) {
								this.info.noticeTitle = validator.joinStr(this.info.noticeTitle, this.keyword)
								this.info.noticeContent = validator.joinStr(this.info.noticeContent, this
									.keyword)
							}

							//设置表头
							uni.setNavigationBarTitle({
								title: (this.info.areaName || '') + ' ' + this.info.noticeType
							});
							this.$initPageTitle();
							this.showPageLoading = false;

							

						}else {
							uni.switchTab({
								url:'/pages/index/index'
							})

						}
					},

					complete: res => {
						
					}
				});

			},

			openUrl(url) {
				uni.navigateTo({
					url: './detail_url?url=\"' + url + '\"'
				})
			},

			openPdf(url) {

				uni.showLoading({
					title: '附件打开中...'
				})
				// #ifdef MP
				let myurl = this.$baseApp.api.zhaobiao.openPdfFile + "?url=" + url
				// console.info(myurl)
				uni.downloadFile({
					url: myurl,
					success: function(res) {
						var filePath = res.tempFilePath;
						// console.info("临时文件保存路径:" + filePath)
						uni.openDocument({
							filePath: filePath,
							fileType: 'pdf',
							showMenu: true,
							success: function(res) {
								// console.log('打开文档成功');
								uni.hideLoading()
							},
							fail(err) {
								console.log('打开失败' + err)
							}
						});
					}
				});


				// #endif


				// #ifdef APP-PLUS || H5
				uni.downloadFile({
					url: url,
					success: function(res) {
						var filePath = res.tempFilePath;
						console.info("临时文件保存路径:" + filePath)
						uni.openDocument({
							filePath: filePath,
							fileType: 'pdf',
							showMenu: true,
							success: function(res) {
								console.log('打开文档成功');
								uni.hideLoading()
							},
							fail(err) {
								console.log('打开失败' + err)
							}
						});
					}
				});
				// #endif


			},

			/*浏览+1*/
			viewCount() {
				this.userAction(this.id, 'view')
			},
			//浏览,收藏,点赞
			userAction(id, type) {
				let url = this.$baseApp.api.zhaobiao.favCount;
				let url_diggCount = this.$baseApp.api.zhaobiao.diggCount;
				let url_viewCount = this.$baseApp.api.zhaobiao.viewCount;
				if (type == 'digg') {
					url = url_diggCount;

				} else if (type == 'view') {
					url = url_viewCount;

				}

				//console.info('=============='+url)


			},
			getUserAction() {
				this.$http.post(url + "/" + id).then(res => {


					if (res.code == '200') {

						if (type == 'digg') {
							uni.showToast({
								title: '点赞成功'
							})
							this.info.diggCount = (this.info.diggCount || 0) + 1
							// this.info['isDigg'] = 1;
							// console.info(this.info.isDigg)
						} else if (type == 'fav') {
							uni.showToast({
								title: '收藏成功'
							})
							this.info.favCount = (this.info.favCount || 0) + 1
							this.info['isFav'] = 1;

						} else if (type == 'view') {

							this.info.viewCount = (this.info.viewCount || 0) + 1
							this.info['isView'] = true;
						}

					}
				});
			},
			
			
			/*打开外部链接*/
			openLink(url) {
				// console.log(url);
				window.location.href = url;
			},

			/*关闭H5分享*/
			closeH5Share() {
				this.showH5Share = false;
			},

			/*关闭微信分享提示*/
			closeShareTip() {
				this.showShareTip = false;
			},
			/*显示浏览器分享提示*/
			showBrowserShareTips() {
				this.showH5Share = false;
				this.showBrowserShareTip = true;
			},
			/*关闭浏览器分享提示*/
			closeBrowserShareTip() {
				this.showBrowserShareTip = false;
			},

			/*分享*/
			share() {
				// #ifdef H5
				if (util.isWechatOrQQ()) {
					this.showShareTip = true;
				} else {
					this.showH5Share = true;
				}
				// #endif

				// console.log('share');

				// #ifdef MP
				// uni.showShareMenu();
				// #endif
			},

			
			/*复制*/
			copyText(text) {
				uni.setClipboardData({
					data: text,
					success: res => {
						this.$alert('原文链接已复制', 'success');
					}
				});
			}
		}
	};
</script>

<style scoped lang="scss">
	.detail {
		padding: 40rpx 32rpx;
		background: #fff;

		.table {
			width: 100%;
			background-color: #e5fdda;
			line-height: 100rpx;
			margin-top: 50rpx;

			view: nth-child(2n) {
				background-color: #b3e19d;
				// background-color:#3ed16c ;
			}

			view:nth-child(2n-1) {
				background-color: #cef5bc;
				// background-color:#00aa8f ;
				// color: #fff;
			}

			.tableItem {
				width: 100%;
				text-align: center;

				.itemLeft {
					width: 30%;

				}

				.itemRight {
					width: 70%;
				}
			}
		}

		.title {
			font-size: 44rpx;
			color: #262626;
			line-height: 70rpx;
			font-weight: bold;
		}

		.info {
			margin-top: 32rpx;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;

			.source-date {
				.source {
					color: #666;
				}

				.date {
					color: #999;
					margin-left: 24rpx;
				}
			}

			.read {
				color: #999;
			}
		}

		.desc {
			margin-top: 56rpx;
			overflow: hidden;
			color: #262626;

			.wxParse {
				color: #262626;
			}

			view {
				margin-bottom: 20rpx;
			}

			.desc_title {
				// background-image: linear-gradient(to right, #00aa8f, #00aa00);
				padding: 4rpx;
				border-radius: 0 10rpx 10rpx 0;
				margin-right: 10rpx;

				border-bottom: 1px solid #ccc;

			}
		}
	}

	.comment {
		padding: 20rpx 32rpx 0;
		background: #fff;

		.title {
			display: flex;
			align-items: center;
			font-size: 36rpx;
			color: #262626;
			font-weight: bold;
			border-bottom: 1rpx solid #eee;

			text {
				padding-bottom: 20rpx;
				line-height: normal;
			}

			.count {
				padding-bottom: 20rpx;
				font-size: 30rpx;
				color: #999;
				margin-left: 10rpx;
				line-height: normal;
			}
		}

		.item {
			display: flex;
			justify-content: space-between;
			padding: 30rpx 0 20rpx;
			border-bottom: 1rpx solid #eee;

			&:last-child {
				border-bottom: 0;
			}

			.avatar {
				flex-grow: 0;
				flex-shrink: 0;
				margin-right: 20rpx;

				image {
					width: 45rpx;
					height: 45rpx;
					border-radius: 50%;
				}
			}

			.comment-info {
				flex-grow: 1;
				flex-shrink: 1;

				.nickname-like {
					display: flex;
					justify-content: space-between;

					.nickname {
						font-size: 32rpx;
						color: #444;
						font-weight: bold;
					}

					.like {
						display: flex;
						align-items: center;

						image {
							width: 32rpx;
							height: 32rpx;
							margin-right: 14rpx;
						}

						.like-count {
							color: #999;
							font-size: 30rpx;
						}
					}
				}

				.comment-desc {
					color: #444;
					font-size: 32rpx;
					line-height: 1.6;
					margin-top: 15rpx;
				}

				.reply-count {
					background: #f2f2f2;
					padding: 8rpx 20rpx;
					font-size: 30rpx;
					color: #999;
					margin: 20rpx 0 24rpx;
				}

				.date-reply {
					display: flex;
					justify-content: space-between;
					align-items: center;

					.date {
						display: flex;
						align-items: center;
						color: #b4b4b4;
						font-size: 28rpx;
						margin-right: 20rpx;
						margin-top: 4rpx;
					}

					.reply {
						flex-grow: 0;
						flex-shrink: 0;
						font-size: 28rpx;
						color: #999;
					}
				}
			}
		}

		.no-comment {
			padding: 40rpx 0;
			color: #999;
			font-size: 30rpx;
		}
	}

	.comment-bar {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 120rpx;
		background-color: #ffffff;
		box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.3);
		display: flex;
		flex-direction: row;

		.input {
			flex-grow: 0;
			flex-shrink: 0;
			margin: 20rpx 10rpx 20rpx 20rpx;
			display: flex;
			align-items: center;
			background: #f2f2f2;
			width: 420rpx;
			border-radius: 40rpx 0rpx 0 40rpx;

			text {
				font-size: 32rpx;
				color: #aaa;
				margin-left: 38rpx;
			}
		}

		.operate {
			width: 100%;
			flex-grow: 1;
			flex-shrink: 1;
			display: flex;
			justify-content: space-around;
			align-items: center;
			margin-right: 10rpx;

			view,
			navigator {
				display: flex;
				justify-content: space-around;
				align-items: center;
				width: 25%;

				image {
					width: 45rpx;
					height: 45rpx;
				}
			}

			.info,
			.like {
				position: relative;

				.count {
					position: absolute;
					top: -15rpx;
					right: -4rpx;
					background-image: linear-gradient(140deg, #bee7e9 9%, #8cc7b5 75%);
					display: flex;
					align-items: center;
					border-radius: 50rpx;
					padding: 0 10rpx;
					font-size: 22rpx;
					color: #fff;
					height: 30rpx;
					line-height: 30rpx;
				}
			}

			.share {
				display: flex;
				justify-content: space-around;
				padding: 0;
				background: transparent;

				image {
					width: 45rpx;
					height: 45rpx;
					border: 0;
				}

				&:after {
					display: none;
				}
			}
		}
	}

	.float-empty {
		height: 120rpx;
		width: 100%;
		display: block;
		background: #fff;
	}

	.add-comment {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		background-color: #ffffff;
		z-index: 9999;

		.info {
			display: flex;
			flex-direction: row;
			padding: 20rpx 20rpx 20rpx 20rpx;

			.input {
				flex-grow: 1;
				flex-shrink: 1;
				display: flex;
				align-items: center;
				background: #f2f2f2;
				border-radius: 40rpx 40rpx 0 40rpx;
				padding: 20rpx 32rpx 20rpx;
				line-height: normal;

				textarea {
					//padding: 10rpx 0;
					width: 100%;
					font-size: 32rpx;
					line-height: 42rpx;
					background: #f2f2f2;
				}
			}

			.add {
				flex-grow: 0;
				flex-shrink: 0;
				width: 150rpx;
				display: flex;
				align-items: center;
				margin-left: 10rpx;
			}

			.cancel {
				position: absolute;
				right: 10rpx;
				top: 2rpx;

				/deep/.icon {
					font-size: 40rpx;
					color: #ccc;
				}
			}
		}
	}

	.h5-share {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		background-color: #ffffff;
		border-top: 1rpx solid #ddd;
		padding-top: 20rpx;
		padding-bottom: 20rpx;

		.title {
			font-size: 30rpx;
			text-align: center;
			height: 50rpx;
		}

		.share-icon {
			display: flex;
			flex-direction: row;
			justify-content: space-around;

			view {
				flex-grow: 0;
				flex-shrink: 0;
				text-align: center;

				image {
					margin-top: 35rpx;
					width: 80rpx;
					height: 80rpx;
				}

				text {
					display: block;
				}
			}
		}

		.share-btn {
			margin: 30rpx 30rpx 15rpx;
			border: 1rpx solid #8cc7b5;
			background: #8cc7b5;
			border-radius: 15rpx;
			font-size: 32rpx;
			text-align: center;
			padding: 12rpx 0;
			color: #fff;
		}
	}

	.share-maske {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.6);
		z-index: 99999;

		.share-tip {
			position: absolute;
			top: 100rpx;
			left: 0;
			text-align: center;

			.share-tip-info {
				height: 240rpx;
			}

			.share-tip-btn {
				margin-top: 400rpx;
				height: 82rpx;
			}
		}

		.share-browser-tip {
			top: 300rpx;

			.share-tip-info {
				height: 240rpx;
			}

			.share-tip-btn {
				margin-top: 200rpx;
			}
		}
	}

	.declaration {
		margin: 50rpx 0;
		font-size: 34rpx;
		color: #999;
	}
</style>
